<template>
  <!-- 出库模板 -->
  <el-row>
    <el-col :span="24">
      <table class="table-box">
        <thead>
          <tr>
            <th>序号</th>
            <th>商品名称</th>
            <th>生产厂商</th>
            <th>供应商</th>
            <th>零售价（￥）</th>
            <th>成本价（￥）</th>
            <th>批次</th>
            <th>有效期</th>
            <th>库存数量</th>
            <th>出库数量</th>
            <th>出库单位</th>
            <th>操作</th>
          </tr>
        </thead>
        <tbody>
          <tr v-for="(item,index) in itemList" :key="index">
            <td v-if="!item.show" colspan="11">
              <el-select
                class="durg_option_box"
                @change="changeDurg(item)"
                v-model="item.durg"
                placeholder="请选择"
                remote
                reserve-keyword
                filterable
                :remote-method="remoteMethod"
              >
                <el-option value :key="-1" label>
                  <p class="durg_title_box">
                    <span>物资名称</span>
                    <span>单位</span>
                    <span>生产厂家</span>
                    <span>供应商</span>
                    <span>零售价</span>
                    <span>批号</span>
                  </p>
                </el-option>
                <el-option
                  v-for="(it,index) in xyList"
                  :key="index"
                  :value="it"
                  :label="it.generalName"
                >
                  <p class="durg_title_box">
                    <span>{{it.goodsName}}</span>
                    <span>{{it.residueNumUnit| changeAssist(dwList)}}</span>
                    <span>{{it.factory}}</span>
                    <span>{{it.supplierName}}</span>
                    <span>￥{{it.retailPrice}}</span>
                    <span>{{it.lotNumber}}</span>
                  </p>
                </el-option>
              </el-select>
            </td>
            <td v-if="item.show">{{index+1}}</td>
            <td v-if="item.show">{{item.sourceName}}</td>
            <td v-if="item.show">{{item.factory}}</td>
            <td v-if="item.show">{{item.supplierName}}</td>
            <td v-if="item.show">{{item.retailPrice}}</td>
            <td v-if="item.show">{{item.purchasePrice}}</td>
            <td v-if="item.show">{{item.lotNumber}}</td>
            <td v-if="item.show">{{item.effectiveTime}}</td>
            <td v-if="item.show">{{item | residueDurg(dwList)}}</td>
            <td v-if="item.show">
              <el-input @blur="getCount(item)" v-model.number="item.outQuantity"></el-input>
            </td>
            <td v-if="item.show">
              <unit
                v-model="item.outQuantityUnit"
                :unit="item.outQuantityUnit"
                :type="type"
                :list="item.unitList"
              ></unit>
              <!-- {{item.packUnit}} -->
            </td>
            <td>
              <el-link type="danger" :underline="false" @click="removeItem(item,index)">删除</el-link>
            </td>
          </tr>
        </tbody>
      </table>
    </el-col>
  </el-row>
</template>
<script>
export default {
  props: ["value", "itemList", "totalMoney"],
  data() {
    return {
      xyList: [],
      total: 0,
      type: 1
    };
  },
  mounted() {
    let th = this;
    th.getDurg();
    th.getBasic();
    th.total = th.totalMoney;
  },
  methods: {
    onDel(obj, index) {},
    getDurg() {
      let th = this;
      let json = { pageNum: 1, pageSize: 20, type: 2, source: 2,numType:1 };
      th.$api.pageStockBatchV2(json).then(res => {
        if (res.executed) {
          th.xyList = res.dataBody.list;
        }
      });
    },
    remoteMethod(query) {
      let th = this;
      th.$api.pageStockBatchV2({
          vagueKey: query,
          pageNum: 1,
          pageSize: 20,
          type: 2,
          source: 2
        }).then(res => {
          if (res.executed) {
            th.xyList = res.dataBody.list;
          }
        });
    },
    changeDurg(item) {
      let th = this;
      item.show = true;
      item.residueNum = parseInt(item.durg.residueNum);
      item.residueNumUnit = item.durg.residueNumUnit;
      item.residueNumSubsection = item.durg.residueNumSubsection;
      item.residueNumSubsectionUnit = item.durg.residueNumSubsectionUnit;
      item.batchId = item.durg.id;
      item.itemId=item.durg.itemId;
      item.retailPrice = item.durg.retailPrice;
      item.purchasePrice = item.durg.purchasePrice;
      item.lotNumber=item.durg.lotNumber;
      item.sourceName = item.durg.goodsName;
      item.supplierName = item.durg.supplierName;
      item.sourceId = item.durg.goodsId;
      item.effectiveTime = item.durg.effectiveTime;
      item.factory = item.durg.factory;
      let unit = [];
      unit.push(item.durg.residueNumUnit);
      item.unitList = unit;
      item.outQuantityUnit = item.durg.residueNumUnit;
    },
    getCount(item) {
      let th = this;
      let intreg = /^\d+$/;
      if (item.outQuantity < 0) {
        item.outQuantity = 0;
      }
      if (!intreg.test(item.outQuantity)) {
        item.outQuantity = 0;
      }
      if (item.outQuantityUnit == item.residueNumUnit) {
        if (item.outQuantity > item.residueNum) {
          th.$message.error("库存数量不足");
          item.outQuantity = 0;
          return false;
        }
      } else {
        if (item.outQuantityUnit == item.residueNumSubsectionUnit) {
          if (item.outQuantity > item.residueNumSubsection) {
            th.$message.error("库存数量不足");
            item.outQuantity = 0;
            return false;
          }
        }
      }
    },
    removeItem(item, index) {
      let th = this;
      th.total = th.total - Number(item.purchaseMoney);
      th.total = th.total.toFixed(2);
      th.$emit("getTotal", th.total);
      th.itemList.splice(index, 1);
      th.$emit("input", th.itemList);
    },
    getBasic() {
      let th = this;
      th.getCommonConfigByKey("单位").then(res => {
        th.dwList = res;
      });
    }
  },
  components: {
    unit: () => import("@/pages/_com/_com/unitSelect")
  }
};
</script>
<style lang="scss" scoped>
.durg_title_box {
  display: inline-block;
  width: 100%;
  > span {
    width: 15%;
    display: inline-block;
  }
}
</style>
